<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title></title>
	<link rel="stylesheet" type="text/css" href="${base}/statics/easyui/material/easyui.css">
	<link rel="stylesheet" type="text/css" href="${base}/statics/easyui/icon.css">
	<link rel="stylesheet" type="text/css" href="${base}/statics/lib/Hui-iconfont/1.0.7/iconfont.css" />
	<script type="text/javascript" src="${base}/statics/lib/jquery/1.9.1/jquery.min.js"></script> 
	<script type="text/javascript" src="${base}/statics/easyui/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="${base}/statics/easyui/common.js"></script>
	<script type="text/javascript" src="${base}/statics/lib/layer/2.1/layer.js"></script> 
	<script type="text/javascript" src="${base}/statics/h-ui/js/H-ui.js"></script> 
	<script type="text/javascript" src="${base}/statics/h-ui.admin/js/H-ui.admin.js"></script> 
</head>
<body>
<div style="padding:0 0 0 15px">
	<table id="tb_treegrid" style="width:100%;padding:10px;">
	</table>
</div>

<script type="text/javascript">
	$(function(){
		treegrid();
	});
	var toolbar = [{
		text:'添加',
		iconCls:'icon-add',
		handler:function(){
			layer_show("添加菜单","${ctrname}/add","","500",function(){});
		}
	},{
		text:'修改',
		iconCls:'icon-edit',
		handler:function(){
			var data=$('#tb_treegrid').treegrid("getSelected");
			if(data==null){
				layer.msg("请选中一条记录");
				return;
			}
			layer_show("添加菜单","${ctrname}/edit?id="+data.id,"","500",function(){});
		}
	},'-',{
		text:'删除',
		iconCls:'icon-remove',
		handler:function(){
			var data=$('#tb_treegrid').treegrid("getSelected");
			if(data==null){
				layer.msg("请选中一条记录");
				return;
			}
			layer.confirm('是否删除【'+data.menu_name+'】?', {
			  btn: ['确定','取消'] //按钮
			}, function(){
				$.getJSON("${ctrname}/remove?id="+data.id,function(data){
					layer.msg(data.msg);
					if(data.status==1){
						treegrid();
					}
				});
			}, function(){
			  
			});
			
		}
	}];
	
	function treegrid(){
		$.getJSON("${ctrname}/treegrid",function(data){
			//要显示的字段  
    		var fileds = "menu_id,menu_name,menu_type,menu_url,menu_order,menu_parent_id,menu_icon";  
    		//获取已转为符合treegrid的json的对象  
    		var nodes = ConvertToTreeGridJson(data, "menu_id", "menu_parent_id", fileds);
    		$('#tb_treegrid').treegrid({
	   			idField: 'id',
	   			treeField: 'menu_name',            
	   	        columns:[[
	   	          {field:'id',hidden:true,checkbox:true},
	   	          {field:'menu_name',title:'菜单名称',width:'200',sortable:true},
	   	          {field:'menu_url',title:'路径',width:'120',sortable:true},
	   	          {field:'menu_order',title:'排序',width:'120',sortable:true},
	   	          {field:'menu_icon',title:'图标',width:'80',sortable:true,formatter: function(value, row, index){
	   	        	if(value!=null&&value!=''){
	   	        		return '<i class="Hui-iconfont">' + value + '</font>';
	   	        	}else{
	   	        		return '无图标';
	   	        	}
	   	        	
			   	  }}
	   	         ]],
	   	         toolbar : toolbar
   		    });
    		$('#tb_treegrid').treegrid("loadData",nodes);
		});
	}
</script>
</body>
</html>